<template>
	<view class="container">
		<!-- {{pjList}} -->
		<!-- {{colList}} -->
		<!-- {{getAccountInfoSync()}} -->
		<!-- {{userInfo}} -->
		<!-- {{collectionList}} -->
		<!-- {{gslist}} -->
		<unicloud-db ref="udb" v-slot:default="{data, loading, error, options}" :options="options"
			:collection="collectionList" :getone="true" :manual="true">
			<view v-if="error">{{error.message}}</view>
			<view v-else-if="loading">
				<uni-load-more :contentText="loadMore" status="loading"></uni-load-more>
			</view>
			<view >
				<!-- {{gslist}} -->
				<!-- {{}} -->
				<uni-card :title="gslist.name" :sub-title="gslist.address" :extra="gslist.type"
					thumbnail="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png">
					<view style="display:flex;justify-content: space-between;margin-bottom:10px">
						<view style="display:flex;">
							评分：<uni-rate v-model="gslist.rata" :readonly="true" @change="onChange" />
						</view>

						<uni-tag size="small" :inverted="true" :text="gslist.city_id[0]['text']" type="success" />
					</view>

					<text style="color:#bbb">{{gslist.content}}</text>
				</uni-card>
			</view>
		</unicloud-db>
		<!-- <unicloud-db ref="udb2" v-slot:default="{data, loading, error, options}" :collection="colList">
			<view v-if="error">{{error.message}}

			</view>
			<view v-else> -->
				<!-- {{data}} -->
				<view style="padding:0 15px">
					<uni-tag style="margin-right:10px" v-for="(item,key) in typeList" :key="key" size="small"
						:inverted="item.value!=type" :text="item.text" type="success" @click.native="type=item.value;getpj()" />
				</view>

				<uni-card style="" v-for="(data,key) in pjlist" :key="key">
					<!-- {{data.no_name}} -->
					<view style="display:flex;align-items: center;justify-content: space-between;">
						<view style="display:flex;align-items: center;">
							<image style="width:30px;height:30px;border-radius: 50%;"
								src="https://qiniu-web-assets.dcloud.net.cn/unidoc/zh/unicloudlogo.png" mode=""></image>
							<text
								style="margin-left:5px;font-size:14px">{{data.no_name?data.user_id[0]['nickname']:'匿名'}}</text>
						</view>
						<view style="display:flex;">
							<uni-rate :readonly="true" v-model="data.rate" @change="onChange" :size="18" />
						</view>
					</view>
					<!-- {{data._id.pj_love}} -->
					<text style="font-size:12px">{{data.content}}</text>
					<view style="margin-top:5px;text-align: right;">
						<uni-icons type="hand-up-filled" size="20" :color="getColor(data)"
							@click="onClicklove(data)"></uni-icons>
						<text style="padding-left:5px;">{{data.love}}</text>
					</view>
				</uni-card>

<!-- 
			</view>
		</unicloud-db> -->
		<view class="btns">
			<button type="primary" size="small" @click="addpl">添加评论</button>
			<!-- <button type="primary" size="small" @click="handleUpdate">修改</button> -->
			<!-- <button type="warn" class="btn-delete" @click="handleDelete">删除</button> -->
		</view>
	</view>
</template>

<script>
	// 由schema2code生成，包含校验规则和enum静态数据
	import {
		enumConverter
	} from '../../js_sdk/validator/gongsi.js'
	const db = uniCloud.database()
	import {
		store,
		mutations
	} from '@/uni_modules/uni-id-pages/common/store.js'
	export default {
		computed: {
			colList() {
				return [db.collection('pj').where(`gs_id=='${this._id}'&&types==${this.type}`).getTemp(), db.collection(
					'pj_love').getTemp(), db.collection('uni-id-users').field('avatar,nickname,_id').getTemp()]
			},
			collectionList(){
				return [db.collection('gongsi').where('_id=="' + this._id + '"').getTemp(), db.collection('city').field(
					'name as text, _id').getTemp()]
			},
			userInfo() {
				return store.userInfo
			},
		},
		data() {
			return {
				// colList: [
				// 	db.collection('pj').getTemp()
				// ],
				gslist:{},
				pjlist:[],
				_id: '',
				type: 1,
				typeList: [{
						"text": "公司环境",
						"value": 1
					},
					{
						"text": "人际关系",
						"value": 2
					},
					{
						"text": "加班情况",
						"value": 3
					},
					{
						"text": "工作难度",
						"value": 4
					},
					{
						"text": "其他",
						"value": 5
					}
				],
				queryWhere: '',
				ratevalue: 5,
				// collectionList: [
				// ],

				loadMore: {

					contentdown: '',
					contentrefresh: '',
					contentnomore: ''
				},
				options: {
					// 将scheme enum 属性静态数据中的value转成text
					...enumConverter
				}
			}
		},
		onShow() {
			this.getpj();
			this.getgs()
			// 当页面显示时触发刷新逻辑
			// this.refreshPage();
			// alert(111);
			// if (this.$refs.udb2) {
				// this.$refs.udb2.loadData({
				// 	clear: true
				// })
				// this.$refs.udb.loadData({
				// 	clear: true
				// })
			// }

		},
		onLoad(e) {
			this._id = e.id;
			// this.getpj()
			// this.$refs.udb2.loadData({
			// 	clear: true
			// })
			// this.$refs.udb.loadData({
			// 	clear: true
			// })

		},
		mounted() {
			// this.$refs.udb2.loadData();
			// this.$forceUpdate()
			// setTimeout(()=>{
			// 	this.$refs.udb.loadData()
			// },200)
		},
		onReady() {
			if (this._id) {
				this.getpj();
				this.getgs()
				// setTimeout(()=>{
				// 	this.$refs.udb.loadData();
				// 	this.$refs.udb2.loadData()
				// },200)
				// this.collectionList = [db.collection('gongsi').where('_id=="' + this._id + '"').getTemp(), db.collection('city').field(
				// 	'name as text, _id').getTemp()]
				// this.getpj()
				// this.colList = [db.collection('pj').where('gs_id=="' + this._id + '"&&type=="'+this.type+'"').getTemp(),db.collection('pj_love').getTemp()]
			}
		},
		methods: {
			async getpj(){
				// alert(111)
				let a = db.collection('pj').where(`gs_id=='${this._id}'&&types==${this.type}`).getTemp();
				let b = db.collection('pj_love').getTemp();
				let c = db.collection('uni-id-users').field('avatar,nickname,_id').getTemp();
				let res = await db.collection(a,b,c).get();
				console.log(res,'结果')
				this.pjlist = res.result.data
					
			},
			async getgs(){
				let a = db.collection('gongsi').where('_id=="' + this._id + '"').getTemp()
				let b = db.collection('city').field('name as text, _id').getTemp()
				let res = await db.collection(a,b).get();
				console.log(res,'结果')
				this.gslist = res.result.data[0]||{}	
			},
			getColor(data) {
				let res = (data._id.pj_love || []).map(item => item.user_id);
				console.log(res)
				if (res.includes(this.userInfo._id)) {
					return 'red'
				} else {
					return 'pink'
				}
			},
			async onClicklove(data) {
				console.log(data,'结果1111')
				uniCloud.callFunction({
					name: 'love',
					data: {
						id: data._id._value
					}
				}).then(r => {
					console.log(r,'点赞的结果');
					this.$set(data, 'love', r.result);
					let res = (data._id.pj_love || []).map(item => item.user_id);
					if (res.includes(this.userInfo._id)) {
						let index = res.indexOf(this.userInfo._id);
						data._id.pj_love.splice(index, 1);
						this.$forceUpdate()
					} else {
						this.$set(data._id, 'pj_love', [{
							user_id: this.userInfo._id
						}]);
						this.$forceUpdate()
					}
				})
				// console.log('点赞的结果');
				// alert(11)
				// db.collection('pj').doc(id).update({
				// 	love:db.command.inc(1)
				// }).then(res=>{
				// 	alert(222)
				// }).catch(err=>{
				// 	alert(111)
				// })
			},
			addpl() {
				uni.navigateTo({
					url: "/pages/pj/add?id=" + this._id
				})
			},
			
			t2f(timestamp) {
				var date = new Date(timestamp); // 转换为Date对象
				var year = date.getFullYear(); // 获取年份
				var month = (date.getMonth() + 1).toString().padStart(2, '0'); // 获取月份并补零
				var day = date.getDate().toString().padStart(2, '0'); // 获取日期并补零
				var hours = date.getHours().toString().padStart(2, '0'); // 获取小时并补零
				var minutes = date.getMinutes().toString().padStart(2, '0'); // 获取分钟并补零
				var seconds = date.getSeconds().toString().padStart(2, '0'); // 获取秒钟并补零

				return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`; // 拼接字符串返回
			},
			handleUpdate() {
				// 打开修改页面
				uni.navigateTo({
					url: './edit?id=' + this._id,
					events: {
						// 监听修改页面成功修改数据后, 刷新当前页面数据
						refreshData: () => {
							this.$refs.udb.loadData({
								clear: true
							})
						}
					}
				})
			},
			handleDelete() {
				this.$refs.udb.remove(this._id, {
					success: (res) => {
						// 删除数据成功后跳转到list页面
						uni.navigateTo({
							url: './list'
						})
					}
				})
			}
		}
	}
</script>

<style>
	.container {
		padding: 10px;
	}

	.btns {
		margin-top: 10px;
		/* #ifndef APP-NVUE */
		display: flex;
		/* #endif */
		flex-direction: row;
	}

	.btns button {
		flex: 1;
	}

	.btn-delete {
		margin-left: 10px;
	}
</style>